<template>
    <div>
        输入框1<el-input v-model="msg1" type="text"></el-input>
        输入框2<el-input v-model='msg2' type="text"></el-input> 
        <el-button type="danger" @click='Totest'>按钮</el-button>

        <router-link to='/test'>到test组件去</router-link>
    </div>
</template>

<script>
// 钩子函数

// beforeCreate  --- 实例创建之前
// created  --- 实例创建之后
// vue局部组件数据以及局部组件的方法创建完成以后，执行的函数

// beforeMount --- dom节点挂载完成之前
// mounted --- dom节点挂载完成以后

// beforeUpdate --- dom节点更新之前
// updated --- dom节点更新之后

// beforeDestroy --- (监听器)实例被销毁之前触发
// destroyed --- (监听器)实例被销毁之后触发


export default {
    

    data() {
        return {
           msg1:'',
           msg2:'' 
        };
    },
 // beforeCreate () {
        //     console.log('before', this.msg1)
        // },
        // created () {
        //     console.log('after', this.msg1)
        // },
        // beforeMount () {
        //     console.log(document.getElementById('div1'))
        // },
        // mounted () {
        //     console.log(document.getElementById('div1'))
        // },
        // beforeUpdate () {
        //     console.log(document.getElementById('div1'))
        // },
        // updated () {
        //     console.log(document.getElementById('div1'))
        // },
        // beforeDestroy () {
        //     console.log(this.msg1)
        //     console.log(document.getElementById('div1'))
        // },
        // destroyed () {
        //     console.log('销毁')
        //     console.log(this.msg1)
        //     console.log(document.getElementById('div1'))
        // },

    methods:{
        Totest(){
            this.$router.push({
                path:'/test'
            }
                )
            }
        }

   
};
</script>

<style scoped lang='scss'>
 
</style>




